import React, { Component } from 'react';
import { connect } from "react-redux";
import { Table } from 'antd';

class RetainedList extends Component {
    constructor(props) {
        super(props);
        this.state = {
            pageNum: 1,
            pageSize: 10,
            userName: '',
            email: '',
            gender: '',
            phone: '',
            startTime: '',
            endTime: '',
        }

        this.columns = [
            {
                title: '时间',
                dataIndex: 'addTime',
            },
            {
                title: '注册',
                dataIndex: 'register',
            },

            {
                title: '次日',
                dataIndex: 'nextDay',
            },
            {
                title: '三日',
                dataIndex: 'threeDay',
            },
            {
                title: '七日',
                dataIndex: 'sevenDay',
            },
            {
                title: '十五日',
                dataIndex: 'fiftyDay',
            },
            {
                title: '三十日',
                dataIndex: 'threetyDay',
            },


        ];
    }
    componentDidMount() {
        this.init();
    }

    init = () => {
        const { preserve } = this.props
        preserve({ page: 1, size: 10 })
    }

    handleChangePreserve = (current, pageSize) => {
        const { newValues } = this.props
        //
        newValues.page = current
        newValues.size = 10
        this.props.preserve({ ...newValues })
    }

    render() {
        const { data, userTotal, userLoading } = this.props;
        const { pageNum, pageSize } = this.state;

        const pagination = {
            current: data.current,//当前页
            total: data.total,//总条数
            pageSize: data.size,//页大小
            onChange: this.handleChangePreserve,
            showQuickJumper: true,//快速跳转
            showSizeChanger: false//大于50时显示pageSize切换器
        };
        return (
            <div>
                <Table columns={this.columns} loading={userLoading} dataSource={data.records} rowKey={record => record.id} pagination={pagination} />
            </div>
        );
    }
}


const mapState = state => ({
    ...state.preserve
});

const mapDispatch = dispatch => ({
    ...dispatch.preserve

})

export default connect(mapState, mapDispatch)(RetainedList);